<template>
  <div class="">
    <el-dialog title="上传违约付款凭证/账户" :visible.sync="dialogBoole" width="780px">
      <el-form :model="form" label-width="120px" class="demo-form-inline">
        <el-card class="box-card" shadow="never">
          <div slot="header" class="header-card">
            <span class="header-card-title">违约金付款凭证</span>
          </div>
          <el-form-item label="附件:" prop="jqxPolicyUrl">
            <image-common v-model="form.jqxPolicyUrl" :limit="5" :disabled="false" :upType="2"/>
          </el-form-item>
        </el-card>

        <el-card class="box-card" shadow="never" style="margin-top: 16px">
          <div slot="header" class="header-card" >
            <span class="header-card-title">承销商收款账户</span>
          </div>

          <el-form-item label="收款账号:" prop="underwriterBankAccount">
            <el-select v-model="form.underwriterBankAccount" @change="handleChange" placeholder="请选择收款账号"
                       style="width: 100%">
              <el-option v-for="item in options"
                         :key="item.accountNumber" :label="item.accountNumber" :value="item.accountNumber"/>
            </el-select>
          </el-form-item>
          <el-form-item label="开户名称:" prop="underwriterBankName">
            <el-input disabled v-model="form.underwriterBankName"/>
          </el-form-item>
          <el-form-item label="开户银行:" prop="underwriterBank">
            <el-input disabled v-model="form.underwriterBank"/>
          </el-form-item>

        </el-card>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="handleSubmit(1)">取 消</el-button>
        <el-button type="primary" @click="handleSubmit(1)">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {underwriterDefault} from "@/api/vehicleDisposal/routineHandle.js"
export default {
  name: 'uploadAccount',//上传违约付款凭证/账户
  computed: {},
  watch: {},
  data() {
    return {
      form: {},
      dialogBoole: false,
      options:[]
    };
  },
  created() {

  },
  mounted() {
  },
  methods: {

    handleOpen() {
      this.dialogBoole = true
      this.handleSelectList()
    },

    handleSelectList(id) {
      queryBySupplierId({supplierId: id}).then(res => {
        if (res.code === 200) {
          this.options = res.data || []
        }
      })
    },

    handleChange(val){
      let index = this.options.findIndex(item => item.accountNumber === val)
      if (index !== -1) {
        this.form.underwriterBankName = this.options[index].accountName
        this.form.underwriterBank = this.options[index].bankName
      }
    },

    handleSubmit(val) {
      if (val === 1) {
        this.dialogBoole = false
      }

      if (val === 2) {
        this.dialogBoole = false
      }
    }

  },
};
</script>




